<!DOCTYPE html>
<html lang="zh" xmlns:th="http://www.thymeleaf.org" xmlns:shiro="http://www.pollix.at/thymeleaf/shiro">
<head>
    <meta http-equiv="Content-Type" content="text/html; charset=UTF-8">

    <meta content="initial-scale=1.0,user-scalable=no,maximum-scale=1,width=device-width" name="viewport">
    <meta content="initial-scale=1.0,user-scalable=no,maximum-scale=1" media="(device-height: 568px)" name="viewport">
    <meta content="yes" name="apple-mobile-web-app-capable">
    <meta content="black" name="apple-mobile-web-app-status-bar-style">
    <meta content="telephone=no" name="format-detection">
    <link rel="stylesheet" type="text/css" href="/yyqhstyle/wap.css">
    <title>预约信息查看</title>

    <script type="text/javascript" src="/yyqhstyle/jquery-1.11.0.min.js"></script>
    <script src="/yyqhstyle/detail_jszgrd.js" type="text/javascript"></script>
    <script src="/yyqhstyle/include.js" type="text/javascript"></script>
    <script src="/yyqhstyle/weixinmap.js" type="text/javascript"></script>
    <script type="text/javascript">
        var SU = SWebPath + '/js/';
        var SSU = SWebPath + "/Img/";
        var SSCSS = SWebPath + "/css/";
        var SLL = [SU + 'comm/function.js',
            SU + 'comm/prototype.js',
            SU + 'comm/commurl.js',
            SU + 'comm/showwindow.js',
            SU + 'comm/pagination.js',
            SU + 'comm/window.js',
            SU + 'comm/msg.js',
            SU + 'comm/effects.js'];
        includeJs(SLL);
        var SSULL = [SSCSS];
        includeCss(SSULL);
    </script>
    <script type="text/javascript" src="/yyqhstyle/function.js"></script>
    <script type="text/javascript" src="/yyqhstyle/prototype.js"></script>
    <script type="text/javascript" src="/yyqhstyle/commurl.js"></script>
    <script type="text/javascript" src="/yyqhstyle/showwindow.js"></script>
    <script type="text/javascript" src="/yyqhstyle/pagination.js"></script>
    <script type="text/javascript" src="/yyqhstyle/window.js"></script>
    <script type="text/javascript" src="/yyqhstyle/msg.js"></script>
    <script type="text/javascript" src="/yyqhstyle/effects.js"></script>
</head>

<body>
<div id="StrContent">
    <div class="sxdetail" th:if="${yyqhs.size()==0}">
        <div class="sxtitle_selected">预约信息</div>
        <div class="detail">
            <dl>
                <dt>暂无数据</dt>
                <dd>未查询到相关数据</dd>
            </dl>
        </div>
    </div>
    <div class="sxdetail" th:if="${yyqhs.size()>0}" th:each="item:${yyqhs}">
        <div class="sxtitle_selected" id="click_1">预约信息</div>
        <div class="detail" id="menu_1">
            <dl>
                <dt>预约时间</dt>
                <dd id="slbh">[[${#dates.format(item.bookedDay, 'yyyy-MM-dd')}]]（[[${item.bookedTime}]]）</dd>
            </dl>
            <dl>
                <dt>预 约 人</dt>
                <dd id="xmmc">[[${item.applyForName}]]</dd>
            </dl>
            <dl>
                <dt>身份证号</dt>
                <dd id="slbm">[[${item.idNum}]]</dd>
            </dl>
            <dl>
                <dt>手机号码</dt>
                <dd id="sqsj">[[${item.phongNum}]]</dd>
            </dl>
            <dl style="border-bottom:none;">
                <dt>预约类型</dt>
                <dd id="blzt">[[${item.guidanceName}]]</dd>
            </dl>
        </div>
        <a th:onclick="canle([[${item.yyqhId}]])">
            <div class="button" align="center">取 消 预 约</div>
        </a>
        <div style="height:20px;"></div>
    </div>
</div>
<script src="/wsyystyle/js/jquery-1.7.2.min.js"></script>
<script th:inline="javascript">
    function canle(id) {
        if (confirm("您确认取消本次预约吗？")) {
            $.ajax({
                url: "/yyqh/web/cancel",
                type: "post",
                dataType: 'json',
                data: {
                    "id": id,
                },
                success: function (data) {
                    if (data.State == 1) {
                        alert("取消成功");
                        location.replace(location.href);
                    } else {
                        alert("取消失败");
                        location.replace(location.href);
                    }
                },
                error: function (XMLHttpRequest, textStatus, errorThrown) {
                    $('body').dialogBox({
                        hasMask: true,
                        hasClose: true,
                        effect: 'sign',
                        hasBtn: true,
                        confirmValue: '确定',
                        title: '提示',
                        content: "数据加载失败!"
                    });
                }
            });
        }
    }


</script>

<style>PANTOOL-PLUGIN {
    display: inline;
    cursor: pointer;
}

PANTOOL-PLUGIN-TIPS {
    white-space: nowrap;
}

.PANTOOL-PLUGIN-VALIDATE-NOTPASS {
    text-decoration: line-through;
    color: #ccc;
}

PANTOOL-PLUGIN-TIPS::before {
    background-position: center;
    background-size: 100% 100%;
    background-repeat: no-repeat;
    box-sizing: border-box;
    width: 1em;
    height: 1em;
    margin: 0 1px .15em 1px;
    vertical-align: middle;
    display: inline-block;
}

.PANTOOL-PLUGIN-VALIDATE-NOTPASS > PANTOOL-PLUGIN-TIPS::before {
    content: '';
    background-image: url()
}

.PANTOOL-PLUGIN-VALIDATE-PASS > PANTOOL-PLUGIN-TIPS::before {
    content: '';
    background-image: url()
}

.PANTOOL-PLUGIN-VALIDATE-UNCERTAINTY > PANTOOL-PLUGIN-TIPS::before {
    content: '';
    background-image: url()
}

.PANTOOL-PLUGIN-VALIDATE-LOCK > PANTOOL-PLUGIN-TIPS::before {
    content: '';
    background-image: url()
}</style>
<div class="xl-chrome-ext-bar" id="xl_chrome_ext_{4DB361DE-01F7-4376-B494-639E489D19ED}" style="display: none;">
    <div class="xl-chrome-ext-bar__logo"></div>

    <a id="xl_chrome_ext_download" href="javascript:;" class="xl-chrome-ext-bar__option">下载视频</a>
    <a id="xl_chrome_ext_close" href="javascript:;" class="xl-chrome-ext-bar__close"></a>
</div>
</body>
</html>